import React from 'react';
import styles from './TeacherList.css';
import {Table, Popconfirm} from 'antd';

function TeacherList({loading,teachers,pagination,onModify,onDelete}) {
    console.log(teachers);
    const columns=[
	{
	    title:'姓名',
	    key:'name',
	    dataIndex:'name',
	    width:64
	},
	{
	    title:'手机号',
	    key:'phoneNumber',
	    dataIndex:'phoneNumber'
	},
	{
	    title:'考勤号',
	    dataIndex:'workId'
	},
	  {
	      title:'操作',
	      key:'operation',
	      width:100,
        render:(text,record)=>(
        <p>
            <a style={{
			          marginRight:4
		    }}
            onClick={()=>{
                onModify(record);
            }}
            >
			          编辑
            </a>
				<Popconfirm
                    title="确认删除吗?"
                    onConfirm={()=>{
                        onDelete(record.id);
		        }}>
		        <a>删除</a>
	        </Popconfirm>
        </p>
	      )
	  }];

    return (
       <Table loading={loading}
	      className={styles.table}
	      columns={columns}
	      dataSource={teachers}
        loading={loading}
        simple
	      rowKey={record => record.id}
	      pagination={pagination} />
  );
}

export default TeacherList;
